<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath =
            request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
                    + path + "/";
%>
<!DOCTYPE html>
<html>
<head>
    <base href="<%=basePath%>">
    <meta charset="UTF-8" name="viewport" content="initial-scale=1.0, user-scalable=no">
    <title>用户信息</title>
    <link rel="shortcut icon" href="static/image/logo01.ico"/>
    <link href="static/easyui/themes/default/easyui.css" rel="stylesheet"/>
    <link href="static/easyui/themes/icon.css" rel="stylesheet"/>
    <script type="text/javascript" src="static/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="static/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="static/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="static/vue/vue.js"></script>
    <!-- ElementUI 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- ElementUI 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
<% String id = session.getAttribute("id").toString(); %>
<table border="1">
    <tr>
        <td>用户名：</td>
        <td>
            <input type="text" id="username" disabled/>
        </td>
    </tr>
    <tr>
        <td>年龄：</td>
        <td>
            <input type="text" id="age"/>
        </td>
    </tr>
    <tr>
        <td>性别：</td>
        <td>
            <input type="text" id="gender"/>
        </td>
    </tr>
    <tr>
        <td>邮箱：</td>
        <td>
            <input type="text" id="email"/>
        </td>
    </tr>
    <tr>
        <td>电话：</td>
        <td>
            <input type="text" id="phone"/>
        </td>
    </tr>
    <tr>
        <td>地址：</td>
        <td>
            <input type="text" id="address"/>
        </td>
    </tr>
</table>
<button id="edit">修改</button>
<script>
  $(function () {
    $.ajax({
      url: 'user/get?id=' +<%=id%>,
      type: "get",
      success: function (response) {
        console.log(response);
        $("#username").val(response.data.username);
        $("#age").val(response.data.age);
        $("#gender").val(response.data.gender);
        $("#email").val(response.data.email);
        $("#phone").val(response.data.phone);
        $("#address").val(response.data.address);
      }
    });

    $("#edit").on('click', function (e) {
      var age = $("#age").val();
      var gender = $("#gender").val();
      var email = $("#email").val();
      var phone = $("#phone").val();
      var address = $("#address").val();

      $.ajax({
        url: "user/update",
        type: "post",
        data: {
          id: <%=id%>,
          age: age,
          phone: phone,
          address: address,
          gender: gender,
          email: email,
        },
        success: function (response) {
          $.messager.show({
            title: '消息提示',
            msg: response.message,
            timeout: 1000,
            showType: 'slide',
            style: {
              right: '',
              top: document.body.scrollTop + document.documentElement.scrollTop,
              bottom: ''
            }
          });
        }
      })
    })
  })

</script>
</body>
</html>
